<template>
  <div class="pass">
    <!-- 通行证管理 -->
    <el-breadcrumb separator="/">
      <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>添加新的事件</el-breadcrumb-item>
    </el-breadcrumb>
  </div>
  <div class="height">
    <el-form class="event" :label-position="labelPosition" label-width="80px">

      <!-- <el-form-item label="发生时间">
                <el-time-picker v-model="formInline.time" :picker-options="{
                    selectableRange: '18:30:00 - 20:30:00'
                }" placeholder="选择时间">
                </el-time-picker>
            </el-form-item> -->
      <div class="block">
        <el-form-item label="发生时间">
          <el-date-picker
            v-model="formInline.time"
            type="datetime"
            placeholder="选择日期时间"
            align="right"
            :picker-options="pickerOptions"
          >
          </el-date-picker>
        </el-form-item>
      </div>

      <div>
        <el-form-item label="你的电话">
          <el-input v-model="formInline.phone"></el-input>
        </el-form-item>
      </div>
      <div>
        <el-form-item label="标题">
          <el-input v-model="formInline.title"></el-input>
        </el-form-item>
      </div>
      <el-form-item label="内容" prop="content">
        <el-input
          :rows="10"
          type="textarea"
          v-model="formInline.message"
          placeholder="请输入内容"
        ></el-input>
      </el-form-item>
      <el-form-item>
        <el-button color="green" @click="submitForm">添加事件</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

    <script>
import { addEventApi } from "../api/index1.js";
import { ElMessage } from "element-plus";
export default {
  data() {
    return {
      labelPosition: "left",
      formInline: {
        message: "",
        phone: "",
        time: "",
        title: "",
      },
    //   ruleForm: {
    //     user: "",
    //     region: "",

    //     desc: "",
    //   },
    //   rules: {
    //     desc: [{ required: true, message: "请填写活动形式", trigger: "blur" }],
    //   },
    };
  },
  methods: {
    submitForm() {
      console.log(this.formInline);
      addEventApi(this.formInline).then((res) => {
        console.log(res);
        this.formInline = {};
        // 2.提示用户添加成功
        if (res.code == 20000) {
          ElMessage({
            message: "添加事件成功",
            type: "success",
          });
        }
        //   this.$router.back()
        this.$router.push("../views/eventManage");
        // this.passList = res.data.data;
        // console.log(this.passList)
      });
    },
    //查询
    onSubmit() {
      console.log("submit!");
    },

  },
};
</script>

    <style lang="less" scoped>
.el-form {
  width: 800px;
}

.notice {
  margin-top: 10px;
  font-weight: bold;
}

.height {
  margin-top: 20px;
}

.height {
  line-height: 10px;
}
</style>
